/** pageContainer **/
.page-container {
    margin: 15px;
    height: calc(100% - 30px);
    display: flex;
    flex-direction: column;

    &-header {
        padding: 15px;

        &--title {
            font-weight: bold;
            font-size: 16px;
        }
    }

    &-body {
        padding: 15px 15px 4px;
        flex: 1;
        overflow: hidden;
        background-color: var(--el-bg-color);
    }

    &-footer {
        padding: 15px;
    }
}

// /** vxe-table **/
// :root {
//     --vxe-table-body-background-color: var(--el-fill-color-blank);
//     --vxe-grid-maximize-background-color: var(--el-fill-color-blank);
//     --vxe-table-row-current-background-color: var(--el-color-primary-light-9);
//     --vxe-table-column-current-background-color: var(--el-color-primary-light-9);
//     --vxe-table-row-hover-background-color: var(--el-fill-color-light);
//     --vxe-table-row-hover-current-background-color: var(--el-color-primary-light-9);
//     --vxe-loading-background-color: var(--el-mask-color-extra-light);
//     --vxe-loading-color: var(--el-color-primary);
//     --vxe-table-tree-node-line-color: var(--el-border-color);
//     --vxe-table-border-color: var(--el-border-color-lighter);
//     --vxe-table-header-font-color: var(--el-text-color);
//     --vxe-table-header-background-color: var(--el-color-info-light-9);
//     --vxe-font-size: var(--el-font-size-base);
//     --vxe-font-color: var(--el-text-color-primary);
//     --vxe-table-font-color: var(--el-text-color-regular);
//     --vxe-table-row-striped-background-color: var(--el-fill-color-light);
//     --vxe-table-row-hover-striped-background-color: var(--el-fill-color-light);
//     --vxe-textarea-background-color: #212b4b;
//     --vxe-table-column-hover-background-color: #334579;
//     --vxe-input-date-picker-hover-background-color: #4d63ad;
//     --vxe-table-row-checkbox-checked-background-color: #405492;
//     --vxe-table-row-radio-checked-background-color: #405492;
//     --vxe-modal-header-background-color: var(--el-bg-color);
//     --vxe-modal-body-background-color: var(--el-bg-color);
//     --vxe-button-default-background-color: var(--el-bg-color);
//     --vxe-pulldown-panel-background-color: var(--el-bg-color);
//     --vxe-input-background-color: var(--el-bg-color);
//     --vxe-select-panel-background-color: var(--el-bg-color);
//     --vxe-radio-button-default-background-color: var(--el-bg-color);
//     --vxe-toolbar-background-color: var(--el-bg-color);
//     --vxe-select-option-hover-background-color: var(--hover-color);
//     // --vxe-font-l10-color: #f5f8fc;
//     // --vxe-font-l20-color: #fff;
//     /*
//   --vxe-font-l10-color:#{darken(#e2ebf6,10%)};
//   --vxe-font-l20-color:#{darken(#e2ebf6,20%)};
//   */
//     // --vxe-pager-font-color: #ffffffe6;
//     // --vxe-row-selected-bg-color: #d39a26;
//     --vxe-table-header-font-weight: 500;

//     div.ant-picker-panel-container {
//         background: var(--vxe-input-background-color);
//     }

//     .ant-picker-range-arrow::after {
//         border-color: var(--vxe-input-background-color);
//     }
// }

.flex-box {
    display: flex;
    height: 100%;

    .tree-nav {
        width: 240px;
        margin: 10px;
        padding: 16px;
        flex-shrink: 0;
        overflow: auto;
        box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1);
        border-radius: 8px;
    }

    .right-container {
        flex-grow: 1;
        overflow: hidden;
        padding: 15px;

        .pagination-table {
            height: 100%;
        }
    }
}